/*
 * @Author: Xia_cc 978487464@qq.com
 * @Date: 2022-08-11 09:36:34
 * @LastEditors: Xia_cc 978487464@qq.com
 * @LastEditTime: 2022-08-15 18:25:08
 * @FilePath: \bpm-management-system\src\component\examinemanage\Chaosonggeiwodeshenpi.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import { Form, Input, Select, Table, Switch, Button, Checkbox, Image,DatePicker } from 'antd';
import React from 'react';
import '../../examinemanage/bianji.css';


const Banzufukuanshenqinbianji = () => {
  const [form] = Form.useForm();
  const { Option } = Select;
  
  const YForm = () => {
    const onChange = (e) => {
      console.log(`checked = ${e.target.checked}`);
    };
    const Change = (date, dateString) => {
      console.log(date, dateString);
    };
    const Table = [
      {
        title: '序号',
        width: 100,
        dataIndex: 'name',
        key: 'name',
        fixed: 'left',
      },
      {
        title: '户名',
        width: 100,
        dataIndex: 'age',
        key: 'age',
        fixed: 'left',
      },
      {
        title: '开户行',
        dataIndex: 'address',
        key: '1',
      },
      {
        title: '账户',
        dataIndex: 'address',
        key: '2',
      },
      {
        title: '操作',
        key: 'operation',
        fixed: 'right',
        width: 100,
        render: () => <Checkbox onChange={onChange}></Checkbox>
      },
    ];
    const data = [
      {
        key: '1',
        name: 'John Brown',
        age: 32,
        address: 'New York Park',
      }, {
        key: '2',
        name: 'Jim Green',
        age: 40,
        address: 'London Park',
      }, {
        key: '3',
        name: 'Jim Green',
        age: 40,
        address: 'London Park',
      },
    ];
    return (
      <>
      <Form form={form} className='CSGWDbianji' IN>
      {/* 第一个框 */}
      <Form.Item name="title" label="标题">
        <Input />
      </Form.Item>
      {/* 第二个框 */}
      <Form.Item
        name="contract"
        label="施工班组合同">
        <Select placeholder="请选择">
          <Option value="china">China</Option>
          <Option value="usa">U.S.A</Option>
        </Select>
      </Form.Item>
      {/* 第三个框 */}
      <Form.Item
        name="project"
        label="关联项目" disabled={true}>
        <Select>
          <Option value="china">China</Option>
          <Option value="usa">U.S.A</Option>
        </Select>
      </Form.Item>
      {/* 第四个框 */}
      <Form.Item
        name="date"
        label="拟付款日期">
        <DatePicker onChange={Change} />
      </Form.Item>
      {/* 第五个框 */}
      <Form.Item
        name="money"
        label="付款金额">
        <Input/>
      </Form.Item>
      {/* 第6个框 */}
      <Form.Item
        name="Table">
        <Table
          columns={Table}
          dataSource={data}
          // scroll={{ x: 1300}}
          pagination={false}
          className="LilTable"
        />
      </Form.Item>
      {/* 多行文本框 */}
      <Form.Item
        name="remark"
        label="合同付款备注">
        <Input.TextArea rows={(6)} />
      </Form.Item>
      {/* 开关 */}
      <Form.Item
        name="Slider"
        label="是否紧急">
        <Switch checkedChildren="开启" unCheckedChildren="关闭" defaultChecked />
      </Form.Item>
      {/* 上传审批单 */}
      <Form.Item
        name="Approval"
        label="项目审批单">
        <Button type='primary'>+ 点击上传</Button>
        <p className='fontP'>文件格式为Word、Excel、PDF、JPG、PNG、ZIP等大小不超过10M</p>
      </Form.Item>
      {/* 产值确认单 */}
      <Form.Item
        name="Confirm"
        label="产值确认单">
        <Button type='primary'>+ 点击上传</Button>
        <p className='fontP'>文件格式为Word、Excel、PDF、JPG、PNG、ZIP等大小不超过10M</p>
      </Form.Item>
      {/* 审批人 */}
      <Form.Item
        name="Approver"
        label="审批人"
        rules={[{ required: true, }]}>
        <Image src="@/assets/images/headerimg.png" className='spanDiv' />
        <span>&gt;</span>
        <Image className='spanDiv' /> &nbsp;
        <Image className='spanDiv'> + </Image>
      </Form.Item>
      {/* 抄送人 */}
      <Form.Item
        name="cc"
        label="抄送人">
        <span className='spanDiv'> + </span>
      </Form.Item>
      <div className='lastForm'>
        <Button type='primary' className='footBut' centered>保存为草稿</Button>
        <Button type='primary' className='footBut' centered>提交审核</Button>
        <Button type='primary' className='footBut' centered>取消</Button>
      </div>
    </Form>
      
      </>
    )
  };
  return (
    <>
      <YForm />
      {/* <pre className="language-bash"></pre> */}
      1111
    </>
  );
};

export default Banzufukuanshenqinbianji;



